// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick
import Qt5Compat.GraphicalEffects

import Fk
import Fk.Components.Common
import Fk.Components.LunarLTK

Item {
  ListModel {
    id: equips
  }

  property int cid: 0
  property string name: ""
  property string suit: ""
  property int number: 0
  property bool sealed: false
  property string subtype

  property string icon: ""
  property alias text: textItem.text

  id: root

  Rectangle {
    id: bg
    anchors.fill: parent
    border.width: 1
    color: "white"
    // border.color: "#88767676"
    opacity: 0.75
  }

  Rectangle {
    anchors.fill: parent
    radius: 2
    visible: sealed
    color: "black"
    opacity: 0.8
  }

  Image {
    id: iconItem
    // smooth: false
    // anchors.verticalCenter: parent.verticalCenter
    x: 3
    y: 1
    height: 13
    width: 13

    source: Cpp.path + "/packages/lunarltk-qsgs-ui/image/equipIcon/background"

    Image {
      visible: !root.sealed
      width: 11
      height: 11
      // smooth: false
      source: {
        let icon = "sword";
        if (root.subtype === "treasure") {
          icon = "sword";
        } else if (root.subtype === "armor") {
          icon = "shield";
        } else if (root.icon === "horse") {
          icon = "horse";
        } else {
          icon = "sword";
          if (root.name.includes('bow')) {
            icon = 'bow';
          } else if (root.name.includes('spear')) {
            icon = 'spear';
          }
        }
        return Cpp.path + "/packages/lunarltk-qsgs-ui/image/equipIcon/" + icon;
      }
      anchors.centerIn: parent
    }
  }

  Image {
    id: suitItem
    anchors.right: parent.right
    source: (suit && !sealed) ? SkinBank.cardSuitDir + suit : ""
    width: implicitWidth / implicitHeight * height
    height: 12
    anchors.verticalCenter: parent.verticalCenter
  }

  GlowText {
    id: numberItem
    visible: !sealed && number > 0 && number < 14
    text: Util.convertNumber(number)
    // font.family: "Arial"
    color: {
      if (suit == "heart" || suit == "diamond") {
        return "#9F151B";
      }
      return "black";
    }
    font.pixelSize: 12
    // font.bold: true
    glow.color: "#FEFEBD"
    glow.spread: 0.75
    glow.radius: 1
    //glow.samples: 4
    anchors.right: suitItem.left
    anchors.rightMargin: 1
    anchors.verticalCenter: parent.verticalCenter
  }

  GlowText {
    id: specialTextItem
    text: root.cid !== 0 ? (root.subtype === "weapon" ? Lua.evaluate(`(function()
        local numList = {"零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "11", "12", "13"}
        local num = Fk:getCardById(${root.cid}).attack_range or
          ClientInstance:getCardOwner(${root.cid}):getVirtualEquip(${root.cid}).attack_range
        if num then
          return numList[num + 1] or "X"
        else
          return ""
        end
      end)()
      `) : "三") : ""
    visible: root.icon !== "horse" && !root.sealed
    opacity: root.subtype === "weapon" ? 1 : 0
    font.family: "LiSu"
    font.pixelSize: 13
    glow.color: "#FEFEBD"
    glow.spread: 0.75
    glow.radius: 2
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter
    anchors.left: iconItem.right
    anchors.leftMargin: 2
  }

  GlowText {
    id: textItem
    font.family: "LiSu"
    font.pixelSize: 13
    anchors.left: specialTextItem.visible ? specialTextItem.right : iconItem.right
    anchors.leftMargin: 3
    // anchors.right: numberItem.left
    // anchors.rightMargin: 4
    color: root.sealed ? "white" : "black"
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter

    glow.color: root.sealed ? "gray" : "#99FEFEBD"
    glow.spread: 0.9
    glow.radius: 2
  }

  ParallelAnimation {
    id: showAnime

    NumberAnimation {
      target: root
      property: "x"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 10
      to: 0
    }

    NumberAnimation {
      target: root
      property: "opacity"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 0
      to: 1
    }
  }

  ParallelAnimation {
    id: hideAnime

    NumberAnimation {
      target: root
      property: "x"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 0
      to: 10
    }

    NumberAnimation {
      target: root
      property: "opacity"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 1
      to: 0
    }
  }

  function reset()
  {
    cid = 0;
    name = "";
    suit = "";
    number = 0;
    text = "";
    icon = "";
    if (sealed) {
      text = '  ' + Lua.tr(subtype + "_sealed");
    }
  }

  function setCard(card)
  {
    cid = card.cid;
    name = card.name;
    suit = card.suit;
    number = card.number;
    text = card.text;
    icon = card.icon;
  }

  function addCard(card) {
    let iconName = "";
    let displayText = "";
    if (card.subtype === "defensive_ride") {
      displayText = "+1";
      iconName = "horse";
    } else if (card.subtype === "offensive_ride") {
      displayText = "-1"
      iconName = "horse";
    } else {
      displayText = Lua.tr(card.name);
      iconName = card.name;
    }
    let newModel = {
      name: card.name,
      cid: card.cid,
      suit: card.suit,
      number: card.number,
      text: displayText,
      icon: iconName,
    }
    setCard(newModel);
    equips.append(newModel);
  }

  function removeCard(cid) {
    let find = false;
    for (let i = 0; i < equips.count; i++) {
      if (equips.get(i).cid === cid) {
        equips.remove(i);
        find = true;
        break;
      }
    }
    if (!find) {
      return;
    }
    if (equips.count === 0) {
      reset();
      hide();
    } else {
      const card = equips.get(0);
      setCard(card);
    }
  }

  function show() {
    if (!sealed) {
      showAnime.start();
    }
  }

  function hide() {
    if (!sealed) {
      hideAnime.start();
    }
  }

  onSealedChanged: {
    showAnime.stop();
    hideAnime.stop();
    x = 0;

    opacity = sealed ? 1 : 0;
    text = '  ' + Lua.tr(subtype + "_sealed")
  }
}
